<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <link rel="stylesheet" href="../../../../../../../static/assets/css/zpui.css" />
    <link rel="stylesheet" href="../../../../../../../static/assets/css/all.css" />
    <script src="../../../../../../../static/assets/js/page.js"></script>

    <title> 资金明细 </title>
</head>

<body>
    <div class="page">
        <div class="page-hd">
            <div class="header bor-1px-b">
                <div class="header-left">
                    <a href="javascript:history.go(-1)" class="left-arrow"></a>
                </div>
                <div class="header-title">资金明细</div>
                <div class="header-right">
                    <a href="#"></a>
                </div>
            </div>
        </div>

        <div class="page-bd">
            <!-- 页面内容-->
            <div class="weui-cells weui-cells_form mt0" style="background: transparent;">
                <div class="weui-cell border-none">
                    <div class="weui-cell__bd">
                        <span class="fs28 fw600">交易类型:</span>
                        <div class="selectinput">
                            <input type="text" id='picker' class="weui-input" value="提现"/>
                        </div>
                    </div>
                    <div class="weui-cell__fd" style="text-align: right;">
                        <span class="fs28 fw600">收入:</span>
                        <div class="selectinput">
                            <input type="text" id='picker1' class="weui-input" value="支出"/>
                        </div>
                    </div>
                </div>
            </div>
            <div class="weui-cells card-box mt0">
                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__bd">
                        <div>
                            <span class="fs28 fw600">时间:</span>
                            <div class="selectinput">
                                <input type="text" id="datetime-picker" class="weui-input" value="全部" />
                            </div>
                        </div>
                        <div class="fs24 text-muted mt10">
                            <span id="zhichu" class="mr30">支出：¥0.00</span>
                            <span id="shouru">收入：¥0.00</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="weui-cells card-box shop-list">
                <script type="text/html" id="orderTpl">
                    {{each list as item index}}
                    <div class="weui-cell">
                        <div class="weui-cell__bd">
                            <div>
                                <span class="fs26 fw600">{{item.change_desc}}</span>
                                <!-- <span class="fs24 text-muted">(订单号:536985469)</span> -->
                            </div>
                            <div class="fs24 text-muted">{{item._time}}</div>
                        </div>
                        <div class="weui-cell__ft">
                            <div class="fs28 fw600 font_number text-defaut">{{item.balance_money}}</div>
                            <div class="fs24 text-muted">余额{{item.old_balance_money}}</div>
                        </div>
                    </div>
                    {{/each}}
                </script>
            </div>
            <div class="empeyOrder" style="width: 100%;text-align: center;display: none;">
                <img style="width: 100%;" src="../../../../../../../static/mobile/default/images/emptyData.png" alt="">
                <span class="fs24 text-muted tc mt30">暂无记录</span>
            </div>
            <div id="jz" style="display: none;margin-bottom: 20px;" class="fs24 text-muted tc mt30">已经到底啦~</div>
        </div>
    </div>


    <script src="../../../../../../../static/assets/js/lib/jquery-2.1.4.js"></script>
    <script src="../../../../../../../static/assets/js/jquery-weui.min.js"></script>
    <script src="../../../../../../../static/assets/js/lib/fastclick.js"></script>
    <script src="../../../../../../../static/tpl/js/art-template.js"></script>
    <script src="../../../../../../../static/mobile/default/js/page.js"></script>
    <script>
        $(function() {
            FastClick.attach(document.body);
        });
    </script>

    <script>
        var nowPage = [],
            getAgain = [],
            isLoadend = [];
        var _type = "shop-list";

        $(function() {
            var get = false;
            $("#picker").picker({
                title: "请选择交易类型",
                cols: [{
                    textAlign: 'center',
                    values: ['全部', '购买商品', '提现','平级奖','直推奖' ,'差价奖', '生产定金', '后台调整', '区域奖励'],
                }],
                onClose: function() {
                    isLoadend[_type] = false;
                    getAgain[_type] = false;
                    nowPage[_type] = 1;
                    get = false;
                    $('.' + _type + '').html('');
                    getList();
                }
            });
            $("#picker1").picker({
                title: "请选择",
                cols: [{
                    textAlign: 'center',
                    values: ['全部', '收入', '支出']
                }],
                onClose: function() {
                    isLoadend[_type] = false;
                    getAgain[_type] = false;
                    nowPage[_type] = 1;
                    get = false;
                    $('.' + _type + '').html('');
                    getList();
                }
            });
            var y = []; //年
            var m = []; //月
            var str_y = 2018; //选择时间从2018开始
            var end_y = "2021";
            for (let index = str_y; index < Number(end_y) + 1; index++) {
                y.push(index + '年');
            }
            for (let index = 1; index < 13; index++) {
                if (index < 10) index = '0' + index;
                m.push(index + '月');
            }
            $("#datetime-picker").picker({
                title: "请选择时间",
                cols: [{
                    textAlign: 'center',
                    values: y
                        //如果你希望显示文案和实际值不同，可以在这里加一个displayValues: [.....]
                }, {
                    textAlign: 'center',
                    values: m
                }, ],
                onClose: function() {
                    isLoadend[_type] = false;
                    getAgain[_type] = false;
                    nowPage[_type] = 1;
                    get = false;
                    $('.' + _type + '').html('');
                    getList();
                }
            });
            // 当用户滚动到页面底部的时候加载更多内容。
            $('.page-bd').infinite(100);
            $('.page-bd').infinite().on("infinite", function() {
                if (get) return;
                getList();
            })
            getList();
            //请求列表数据
            function getList(isagain) {
                page = nowPage[_type];
                var logtype = $('#picker').val(); //类型
                var logstatus = $('#picker1').val(); //收入类型
                var logtime = $('#datetime-picker').val(); //
                $('.empeyOrder').hide();
                if (typeof(page) == 'undefined') page = 1;
                if (isLoadend[_type] == true) return false;
                if (isagain == true) {
                    if (getAgain[_type] == false) return false;
                    getAgain[_type] = false;
                } else {
                    $('#jz').show().text('内容加载中~');
                }
                isLoadend[_type] = true;
                $.ajax({
                    url: '/member/api._users/getaccountlog/p/'+page+'.html', // 跳转到 action
                    data: {
                        'logtype': logtype,
                        'flag': logstatus,
                        'time': logtime,
                        'type': 'balance'
                    },
                    type: 'post',
                    cache: false,
                    headers:{'token': $.cookie('code')},
                            dataType: 'json',
                    success: function(res) {
                        $('#zhichu').text('支出：¥' + res.expend);
                        $('#shouru').text('收入：¥' + res.income);
                        isLoadend[_type] = false;
                        if (res.code == 0) {
                            _alert(res.errmsg);
                            getAgain[_type] = true;
                            $('#jz').show().text('加载失败，点击重新加载.');
                            return false;
                        }
                        nowPage[_type] = page + 1;
                        $('#jz').hide();

                        if (res.list.length > 0) {
                            $('.' + _type + '').append(template('orderTpl', res));
                        } else {
                            $('.' + _type + '').html('');
                            $('.empeyOrder').show();
                        }

                        if (res.page_count == page) {
                            $('#jz').show().text('---我也有底线的---');
                            isLoadend[_type] = true;
                            get = true;
                        }
                    },
                    error: function() {
                        isLoadend[_type] = false;
                        getAgain[_type] = true;
                        $('#jz').text('加载失败，点击重新加载.');
                    }
                });
            }

        })
    </script>
</body>

</html>